<!DOCTYPE html>
<html lang="en">
     <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <style>
            h1 {text-align:center;}
            .center {margin:0 auto;}/*margin:auto表示横竖都居中，margin: 0 auto表示横居中，竖不居中；*/
            input{
                display: block;
            }
            input[type=text], select {
                                        width: 25%;
                                        padding: 12px 20px;
                                        margin: 8px 0;
                                        border: 1px solid white;
                                        border-radius: 4px;/*圆角边框*/
                                        box-sizing: border-box;
                                        text-align:left;
                                        border: 1px solid #0e0e0e;
                                        margin: auto;
                                     }
            input[type=submit] {
                                    width: 25%;
                                    background-color: rgb(255, 91, 0);
                                    color: white;
                                    padding: 14px 20px;
                                    margin: 8px 0;
                                    border: none;
                                    border-radius: 4px;
                                    cursor: pointer;
                                    text-align:center;
                                    margin: auto;
                                }

            input[type=submit]:hover {background-color: rgb(255, 91, 0);}
            img {
                    display: block;
                    margin: 0 auto;
                }                        
            div {
                    border-radius: 5px;
                    background-color: white;
                    padding: 20px;
                }
        </style>
     </head>
     <body>
        <p><img src="bai.png"></p>
        <p ><img src="xm.png" alt=""></p><!--alt为图片替换文字内容,body注释与style注释格式不同-->
        <h1>小米账号登录</h1>
            <div class="center">
                <input type="text" value="邮箱/手机号码/小米ID" >
            </div>
            <div class="center">
                <input type="text" value="密码">
            </div>
            <div class="center">
                <input type="submit" value="登录"  >
            </div>
     </body>
</html>

